﻿
/* --- Base Reveal Logic (Invisibile at start) --- */
.reveal-item {
    opacity: 0;
    transform-style: preserve-3d;
    will-change: transform, opacity, filter;
}

/* 1. Cinematic 3D */
@keyframes rvl-3d-kf {
    0% {
        opacity: 0;
        transform: perspective(1000px) rotateX(-15deg) translateY(40px) scale(0.95);
    }

    100% {
        opacity: 1;
        transform: perspective(1000px) rotateX(0deg) translateY(0) scale(1);
    }
}

.rvl-3d.rvl-active {
    animation: rvl-3d-kf 0.9s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}

/* 2. Elastic Pop */
@keyframes rvl-pop-kf {
    0% {
        opacity: 0;
        transform: scale(0.7);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

.rvl-pop.rvl-active {
    animation: rvl-pop-kf 0.9s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

/* 3. Apple Style Blur */
@keyframes rvl-blur-kf {
    0% {
        opacity: 0;
        filter: blur(15px);
        transform: translateY(20px);
    }

    100% {
        opacity: 1;
        filter: blur(0);
        transform: translateY(0);
    }
}

.rvl-blur.rvl-active {
    animation: rvl-blur-kf 1.0s ease-out forwards;
}

/* 4. Slide From Left */
@keyframes rvl-left-kf {
    0% {
        opacity: 0;
        transform: translateX(-50px);
    }

    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

.rvl-left.rvl-active {
    animation: rvl-left-kf 0.99s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

/* 5. Slide From Right */
@keyframes rvl-right-kf {
    0% {
        opacity: 0;
        transform: translateX(50px);
    }

    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

.rvl-right.rvl-active {
    animation: rvl-right-kf 0.99s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

/* 6. Modern Skew Entrance */
@keyframes rvl-skew-kf {
    0% {
        opacity: 0;
        transform: skewY(2deg) translateY(30px);
    }

    100% {
        opacity: 1;
        transform: skewY(0deg) translateY(0);
    }
}

.rvl-skew.rvl-active {
    animation: rvl-skew-kf 0.99s ease-out forwards;
}

/* 7. Camera Focus Zoom */
@keyframes rvl-zoom-kf {
    0% {
        opacity: 0;
        transform: scale(1.1);
        filter: blur(8px);
    }

    100% {
        opacity: 1;
        transform: scale(1);
        filter: blur(0);
    }
}

.rvl-zoom.rvl-active {
    animation: rvl-zoom-kf 0.7s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}

/* --- Fast Delays --- */
.rvl-delay-1 {
    animation-delay: 0.1s !important;
}

.rvl-delay-2 {
    animation-delay: 0.2s !important;
}

.rvl-delay-3 {
    animation-delay: 0.3s !important;
}

.rvl-delay-4 {
    animation-delay: 0.4s !important;
}
